<template>
	<view>
		<cu-custom bgColor="bg-gradual-red" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">个人中心</block>
		</cu-custom>

		<view class="bg-gradual-red my-height ">

			<view v-if="!isLogin" class="flex  justify-center  align-center">
				<button class="cu-btn round lines-white lg margin-top-sm" @click="toLogin">登陆/注册</button>
			</view>
			<view v-if="isLogin" class="flex  justify-center  align-center">
				<button class="cu-btn round lines-white  margin-top-sm" @click="showModal" data-target="DialogModal1">退出系統</button>
			</view>

		</view>

	<button class="cu-btn round lines-white  margin-top-sm"  open-type="getUserInfo"   @getuserinfo="test"  >测试</button>



		<!-- 模態框 显示地方-->
		<view class="cu-modal" :class="modalName=='DialogModal1'?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">温馨提示</view>
					<view class="action" @tap="hideModal">
						<text class="cuIcon-close text-red">
							
						</text>
					</view>
				</view>
				<view class="padding-xl">
						你确定要退出系统吗
				</view>
				<view class="cu-bar bg-white justify-end">
					<view class="action">
						<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
						<button class="cu-btn bg-green margin-left" @tap="logout">确定</button>

					</view>
				</view>
			</view>
		</view>
		<!-- 模態框 显示地方-->


		<view class="cu-list menu sm-border margin-top">
			<view class="cu-item arrow">
				<navigator url="../info/info" open-type="navigate" animation-duration="3000">
					<view class="content">
						<text class="cuIcon-circlefill text-grey"></text>
						<text class="text-grey">个人信息</text>
					</view>
				</navigator>
			</view>


			<view class="cu-item arrow">
				<view class="content">
					<text class="cuIcon-circlefill text-grey"></text>
					<text class="text-grey">图标 + 标题</text>
				</view>
			</view>
			<view class="cu-item arrow">
				<view class="content">
					<text class="cuIcon-circlefill text-grey"></text>
					<text class="text-grey">图标 + 标题</text>
				</view>
			</view>
		</view>



	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLogin: this.$global.isLogin,
				modalName: null
			}
		},
		onLoad: function() {
			//this.isLogin = this.$global.isLogin
		},
		methods: {
			toLogin: function() {
				//跳转页面
				uni.redirectTo({
					url: '../login/login'
				});


			},
			//弹框事件
			showModal: function(e) {
				this.modalName = e.currentTarget.dataset.target
			},
			hideModal: function() {
				this.modalName = null;
			},
			//退出
			logout: function() {
				//请求token、、

				try {
					uni.clearStorageSync();
				} catch (e) {
					// error
				}

				//更改登陆标志 
				this.isLogin = false;
				//框框也是需要隐藏的
				this.modalName = null;



			},
			test: function() {

				uni.getUserInfo({
					provider: 'weixin',
					//授权成功的回调
					success(res) {
						uni.showToast({
							title: '授权成功',
							icon: 'none'
						})
						console.info(res.data)
						//that.login(res.data);//授权成功调用自己的登录方法就可以了
					},
					//第一次进入小程序
					fail() {
						uni.showToast({
							title: '请点击授权进行登录',
							icon: 'none'
						});
					}
				});




			}





		}
	}
</script>

<style>
	.my-height {
		height: 200upx;

	}
</style>
